<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>基本信息</title>
<link rel="stylesheet" href="/js/layui-2.5.4/css/layui.css">
<script src="/js/layui-2.5.4/layui.js"></script>
</head>
<body>
	<blockquote class="layui-elem-quote">基本设置</blockquote>
	<form id="update-student-form" class="layui-form layui-form-pane"
		lay-filter="update-student-form">
		<table class="layui-table" lay-skin="row">
			<tbody>
				<tr style="display: none;">
					<td>
						<!-- <div class="layui-form-item" style="display: none;"> -->
						<div class="layui-form-item">
							<label class="layui-form-label">id</label>
							<div class="layui-input-block">
								<input id="idS" type="text" name="id" class="layui-input"
									readonly>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td>
						<div class="layui-form-item">
							<label class="layui-form-label">姓名</label>
							<div class="layui-input-block">
								<input type="text" name="username" class="layui-input"
									autocomplete="off" placeholder="请输入姓名" maxlength="20" readonly>
							</div>
						</div>
					</td>
					<td>
						<div class="layui-form-item">
							<label class="layui-form-label">学号</label>
							<div class="layui-input-block">
								<input type="text" name="studentid" class="layui-input"
									onkeyup="value=value.replace(/[^\d]/g,'')" placeholder="请输入学号"
									autocomplete="off" maxlength="20" readonly>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td>
						<div class="layui-form-item">
							<label class="layui-form-label">图片位置</label>
							<div class="layui-input-block">
								<input type="text" name="images" class="layui-input"
									autocomplete="off" placeholder="请输入图片位置"
									style="width: 70%; display: inline-block;">
								<!-- 								<button type="button" class="layui-btn" id="test1">
									<i class="layui-icon">&#xe67c;</i>上传图片
								</button> -->
								<!-- 								<button type="button" class="layui-btn" id="test1">上传图片</button>
								<div class="layui-upload-list">
									<img class="layui-upload-img" id="demo1">
									<p id="demoText"></p>
								</div> -->
							</div>
						</div>
					</td>
					<td><div class="layui-form-item">
							<label class="layui-form-label">电话</label>
							<div class="layui-input-block">
								<input type="text" name="phone" class="layui-input"
									placeholder="请输入联系电话"
									onkeyup="value=value.replace(/[^\d]/g,'')" autocomplete="off"
									maxlength="13">
							</div>
						</div></td>
				</tr>
				<tr>
					<td><div class="layui-form-item">
							<label class="layui-form-label">地址</label>
							<div class="layui-input-block">
								<input type="text" name="address" class="layui-input"
									placeholder="请输入家庭地址" autocomplete="off" maxlength="20">
							</div>
						</div></td>
					<td><div class="layui-form-item">
							<label class="layui-form-label">Q&nbsp;Q</label>
							<div class="layui-input-block">
								<input type="text" name="qq" class="layui-input"
									placeholder="请输入QQ" onkeyup="value=value.replace(/[^\d]/g,'')"
									autocomplete="off" maxlength="20">
							</div>
						</div></td>
				</tr>
				<tr>
					<td>
						<div class="layui-form-item">
							<label class="layui-form-label">学院</label>
							<div class="layui-input-block">
								<input type="text" name="college" class="layui-input"
									autocomplete="off" placeholder="学院随班级修改而修改" readonly>
							</div>
						</div>
					</td>
					<td>
						<div class="layui-form-item">
							<label class="layui-form-label">班级</label>
							<div class="layui-input-block">
								<input type="text" name="inclass" class="layui-input"
									autocomplete="off" placeholder="班级" readonly>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td><div class="layui-form-item">
							<label class="layui-form-label">生日</label>
							<div class="layui-input-block">
								<input id="birthdateS" type="text" name="birthdate"
									class="layui-input" placeholder="yyyy-MM-dd" autocomplete="off"
									placeholder="请输入生日">
							</div>
						</div></td>
					<td>
						<div class="layui-form-item">
							<label class="layui-form-label">性别</label>
							<div class="layui-input-block">
								<input type="radio" name="sex" value="1" title="男"> <input
									type="radio" name="sex" value="2" title="女">
							</div>
						</div>
					</td>
				</tr>
			</tbody>
		</table>
		<div class="layui-form-item" style="text-align: center;">
			<button class="layui-btn" lay-submit
				lay-filter="update-student-form-submit">提交</button>
			<button class="layui-btn layui-btn-primary" type="reset">清空</button>
		</div>
	</form>

	<script>
		//JavaScript代码区域
		layui.use(
				[ 'jquery', 'layer', 'element', 'laydate', 'upload', 'form' ],
				function() {
					var $ = layui.$;
					var layer = layui.layer;
					var element = layui.element;
					var laydate = layui.laydate;
					var form = layui.form;
					var upload = layui.upload;
					//执行一个laydate实例
					laydate.render({
						elem : '#birthdateS' //指定元素
					});
					//普通图片上传
					/* 					  var uploadInst = upload.render({
					 elem: '#test1'
					 ,url: 'https://httpbin.org/post' //改成您自己的上传接口
					 ,before: function(obj){
					 //预读本地文件示例，不支持ie8
					 obj.preview(function(index, file, result){
					 $('#demo1').attr('src', result); //图片链接（base64）
					 });
					 }
					 ,done: function(res){
					 //如果上传失败
					 if(res.code > 0){
					 return layer.msg('上传失败');
					 }
					 //上传成功
					 }
					 ,error: function(){
					 //演示失败状态，并实现重传
					 var demoText = $('#demoText');
					 demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
					 demoText.find('.demo-reload').on('click', function(){
					 uploadInst.upload();
					 });
					 }
					 }); */
					//执行实例
					/* 					var uploadInst = upload.render({
					 elem : '#test1' //绑定元素
					 ,
					 url : '/upload/' //上传接口
					 ,
					 done : function(res) {
					 //上传完毕回调
					 },
					 error : function() {
					 //请求异常回调
					 }
					 }); */

					//基本数据加载
					$.ajax({
						url : "/report/findlogin",
						type : "GET",
						contentType : 'application/json',
						dataType : 'json',
						success : function(data) {
							//console.log(data.user.username);
							form.val('update-student-form', {
								"id" : data.student.id,
								"username" : data.student.username,
								"images" : data.student.images,
								"studentid" : data.student.studentid,
								"inclass" : data.student.inclass,
								"address" : data.student.address,
								"college" : data.student.college,
								"phone" : data.student.phone,
								"sex" : data.student.sex,
								"birthdate" : data.student.birthdate,
								"qq" : data.student.qq
							});

						},
						error : function() {
							console.log("ajax error");
						}
					});
					$('#update-student-form')[0].reset();
					// 用户信息表单提交
					form.on('submit(update-student-form-submit)',
							function(data) {
								// ajax方式更新用户
								$.ajax({
									url : "/student/update",
									type : "PUT",
									//data : data,
									data : JSON.stringify(data.field),
									contentType : 'application/json',
									dataType : 'json',
									success : function(data) {
										if (data.status == 1) {
											layer.close(layer.index);
											parent.layer.msg(data.msg, {
												icon : 1,
												shade : 0.3,
												time : 2000
											})
										} else {
											parent.layer.msg(data.msg, {
												icon : 2,
												shade : 0.3,
												time : 2000
											});
										}
									},
									error : function() {
										layer.open({
											title : '系统提示',
											content : '发生未知错误，请联系管理员！'
										});
									}
								});
								// 阻止表单跳转
								return false;
							});

				});
	</script>

</body>
</html>